<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">

    <ui:composition template="layout.xhtml">
        <ui:define name="title">
            <h2><a href="#" class="back" onclick="history.go(-1)"/>Cadastrar Projeto</h2>
        </ui:define>

        <ui:define name="body">
            <h:form id="projetoForm" enctype="multipart/form-data">            
                <p:messages id="messages" closable="true" showDetail="false" autoUpdate="true"  />
                <p:panel id="projetoPanel" styleClass="container_24 clearfix" >
                    <h2>Projeto</h2>
                    <p:outputLabel value="Nome:" styleClass="grid_3" for="nomeInputText"/>
                    <p:inputText styleClass="grid_20" required="true"  requiredMessage="Nome é Obrigatório"
                                 id="nomeInputText" value="#{managerCriarProjeto.projeto.nome}"  />
                    <div class="clear"/>

                    <p:outputLabel value="Gestor:" styleClass="grid_3" for="gestorInputText"/>
                    <p:inputText styleClass="grid_20" id="gestorInputText" value="#{managerCriarProjeto.projeto.gestor}"/>


                    <div class="clear"/>
                    <p:outputLabel for="secInput" value="Campus:" styleClass="grid_3"/>  
                    <p:inputText id="secInput" styleClass="grid_18" style="width: #{managerCriarProjeto.secretaria.id eq null ? '78%;':'74.5%'}" 
                                 required="true" readonly="true"
                                 value="#{managerCriarProjeto.secretaria.nome}" />
                    <p:panel id="buttonsPanel" style="background: none; border: none; margin-top: -10px;height: 10px;">
                        <p:commandButton icon="ui-icon-plus" style="margin-left: -8px;" oncomplete="dlg.show();"
                                         update="@this" process="@this"/>
                        <p:commandButton id="removerSecretariaCommandButton" icon="ui-icon-trash" 
                                         update=":projetoForm:secInput,:projetoForm:buttonsPanel, @this"
                                         process="@this" immediate="true" rendered="#{managerCriarProjeto.secretaria.id ne null}"
                                         actionListener="#{managerCriarProjeto.removerSecretaria()}"/>
                    </p:panel>

                    <div class="clear"/>

                    <p:outputLabel value="Responsável Projeto:" styleClass="grid_5" style="margin-left: -64px" for="respInputText"/>
                    <p:inputText styleClass="grid_20" style="width: #{managerCriarProjeto.responsavel.id eq null ? '78%;':'74.5%'}"
                                 required="true"
                                 id="respInputText" value="#{managerCriarProjeto.responsavel.nome}"/>
                    <p:panel id="buttonsRespPanel" style="background: none; border: none; margin-top: -10px; height: 10px;">
                        <p:commandButton icon="ui-icon-plus" style="margin-left: -8px;" oncomplete="dlgresp.show();"
                                         update="@this" process="@this"/>
                        <p:commandButton id="removerResponsavelCommandButton" icon="ui-icon-trash" 
                                         update=":projetoForm:respInputText,:projetoForm:buttonsRespPanel, @this"
                                         process="@this" immediate="true" rendered="#{managerCriarProjeto.responsavel.id ne null}"
                                         actionListener="#{managerCriarProjeto.removerResponsavel()}"/>
                    </p:panel>
                    <div class="clear"/>
                    <p:outputLabel value="Usuários Relacionados:" styleClass="grid_5" 
                                   style="margin-left: -64px;" for="respInputText"/>
                    <div class="clear" />
                        <p:pickList id="pojoPickList" value="#{managerCriarProjeto.acompanhantes}" var="userfollow" 
                                    itemValue="#{userfollow}" itemLabel="#{userfollow.nome}"
                                    converter="usuarioconverter"  style="margin-left: 14% !important"
                                    showSourceFilter="true" showTargetFilter="true" filterMatchMode="contains" >

                            <f:facet name="sourceCaption">Usuários</f:facet>
                            <f:facet name="targetCaption">Selecionados</f:facet>

                            <p:column style="width: #{userfollow.setor eq null ? '98%':'50%'}; white-space: pre-wrap;" >
                                <h:outputText value="#{userfollow.nome}"/>
                            </p:column>
                            <p:column style="width: 50%;white-space: pre-wrap;" rendered="#{userfollow.setor ne null}" >
                                <h:outputText value="- #{userfollow.setor.secretaria.nome}"/>
                            </p:column>

                        </p:pickList>

                    <div class="clear"/>
                    <p:outputLabel value="Início de Vigência:" styleClass="grid_4" style="margin-left: -26px;" for="inicioVigenciaInputText"/>
                    <p:calendar styleClass="grid_8 omega" value="#{managerCriarProjeto.projeto.vigenciaInicial}" id="inicioVigenciaInputText" pattern="dd/MM/yyyy" showOn="both"/>

                    <p:outputLabel value="Fim de Vigência:" styleClass="grid_6 alpha" for="fimVigenciaInputText"/>
                    <p:calendar styleClass="grid_8" value="#{managerCriarProjeto.projeto.vigenciaFinal}" id="fimVigenciaInputText" pattern="dd/MM/yyyy" showOn="both"/>

                    <div class="clear"/>

                    <p:outputLabel value="Descrição:" styleClass="grid_3" for="descInputText"/>
                    <p:inputTextarea styleClass="grid_20" id="descInputText" value="#{managerCriarProjeto.projeto.descricao}"/>

                    <div class="clear"/>



                    <h2>Localização</h2>

                    <div class="clear"/>


                    <p:outputLabel value="CEP:" styleClass="grid_3" for="cepInputMask" />
                    <p:inputMask   styleClass="grid_9" mask="99.999-999"
                                   value="#{managerCriarProjeto.endereco.cep}" > 
                    </p:inputMask>

                    <p:outputLabel value="Número: " styleClass="grid_3 " for="numInputText" />
                    <p:inputText styleClass="grid_8 "
                                 value="#{managerCriarProjeto.endereco.numero}" />

                    <div class="clear"/>

                    <p:outputLabel value="Logradouro:" styleClass="grid_3 " for="patioInputText" />
                    <p:inputText  styleClass="grid_9" 
                                  value="#{managerCriarProjeto.endereco.logradouro}" />


                    <p:outputLabel value="Bairro: " styleClass="grid_3 " for="bairroInputText" />
                    <p:inputText  styleClass="grid_8" 
                                  value="#{managerCriarProjeto.endereco.bairro}" />

                    <div class="clear"/>

                    <p:outputLabel value="Complemento: " styleClass="grid_3 " for="complementInputText" />
                    <p:inputText  styleClass="grid_20" 
                                  value="#{managerCriarProjeto.endereco.compl}" />



                    <div class="clear"/>

                    <h2>Empresa</h2>

                    <p:panel id="empresaPanel" style="background: none; border: none; margin-left: -18px;">

                        <p:outputLabel value="CNPJ:" styleClass="grid_3" for="cnpjInputText"/>

                        <p:inputMask id="cnpjInputText"
                                     value="#{managerCriarProjeto.empresa.cnpj}" 
                                     styleClass="grid_8" 
                                     mask="99.999.999/9999-99"
                                     autocomplete="false" readonly="true" >
                        </p:inputMask>

                        <p:commandButton icon="ui-icon-search" style="margin-left: -8px;" oncomplete="dlgempresa.show();"
                                         update="@this" process="@this"/>

                        <div class="clear"/>

                        <p:outputLabel value="Razão Social:" styleClass="grid_3" for="empresaInputText"/>
                        <p:inputText styleClass="grid_20"  readonly="true" id="empresaInputText" value="#{managerCriarProjeto.empresa.nomeFantasia}"/>

                        <div class="clear"/>


                        <p:outputLabel value="Responsável:" styleClass="grid_5" style="margin-left: -64px;" for="responsavelInputText"/>
                        <p:inputText styleClass="grid_20" id="responsavelInputText" value="#{managerCriarProjeto.projeto.responsavelEmpresa}"/>

                        <div class="clear"/>
                    </p:panel>
                    <div class="clear"/>
                    <h2>Endereço da Empresa</h2>


                    <p:panel id="addressPanel"
                             style="background: none; border: none; margin-left: -18px;">


                        <p:outputLabel value="CEP:" styleClass="grid_3" for="cepInputMask" />
                        <p:inputMask  id="cepInputMask"  readonly="true" styleClass="grid_9" mask="99.999-999"
                                      value="#{managerCriarProjeto.enderecoempresa.cep}" > 
                        </p:inputMask>

                        <p:outputLabel value="Número: " styleClass="grid_3 " for="numInputText" />
                        <p:inputText id="numInputText"  readonly="true" styleClass="grid_8 "
                                     value="#{managerCriarProjeto.enderecoempresa.numero}" />

                        <div class="clear"/>

                        <p:outputLabel value="Logradouro:" styleClass="grid_3 " for="patioInputText" />
                        <p:inputText id="patioInputText"  readonly="true" styleClass="grid_9" 
                                     value="#{managerCriarProjeto.enderecoempresa.logradouro}" />


                        <p:outputLabel value="Bairro: " styleClass="grid_3 " for="bairroInputText" />
                        <p:inputText id="bairroInputText"  readonly="true" styleClass="grid_8" 
                                     value="#{managerCriarProjeto.enderecoempresa.bairro}" />

                        <div class="clear"/>

                        <p:outputLabel value="Município: " styleClass="grid_3 " for="municipioInputText" />
                        <p:inputText id="municipioInputText"  readonly="true" styleClass="grid_9"
                                     value="#{managerCriarProjeto.enderecoempresa.municipio}" />

                        <p:outputLabel value="Estado: " styleClass="grid_3 " for="estadoInputText" />
                        <p:inputText id="estadoInputText"  readonly="true" styleClass="grid_8"
                                     value="#{managerCriarProjeto.enderecoempresa.uf}" />

                        <div class="clear"/>

                        <p:outputLabel value="Complemento: " styleClass="grid_3 " for="complementInputText" />
                        <p:inputText id="complementInputText"  readonly="true" styleClass="grid_20" 
                                     value="#{managerCriarProjeto.enderecoempresa.compl}" />

                    </p:panel>

                    <div class="clear"/>
                    <h2>Financeiro</h2>

                    <p:outputLabel value="Linha de Financiamento:" styleClass="grid_5" 
                                   style="margin-left: -64px;" for="financiamentoInputText"/>
                    <p:inputText styleClass="grid_9" id="financiamentoInputText" value="#{managerCriarProjeto.projeto.linhaFinanciamento}"/>

                    <p:outputLabel value="Data Assinatura:" styleClass="grid_4" style="margin-left: -2px;" 
                                   for="signatureInputText"/>
                    <p:calendar styleClass="grid_8" value="#{managerCriarProjeto.projeto.dataAssinatura}" 
                                id="signatureInputText" pattern="dd/MM/yyyy" showOn="both"/>

                    <div class="clear"/>

                    <p:outputLabel value="Valor Global:" styleClass="grid_3" for="orcInputText"/>
                    <p:inputText styleClass="grid_20" id="orcInputText" value="#{managerCriarProjeto.projeto.orcado}"
                                 onkeypress="jQuery(this).autoNumeric({aSign:'R$ ', aSep: '.', aDec: ','} );">
                        <f:convertNumber type="currency" locale="pt,BR"/>
                    </p:inputText>

                    <div class="clear"/>

                    <p:outputLabel value="Contrapartida:" styleClass="grid_3" for="contraInputText"/>
                    <p:inputText styleClass="grid_20" id="contraInputText" value="#{managerCriarProjeto.projeto.contraPartida}"
                                 onkeypress="jQuery(this).autoNumeric({aSign:'R$ ', aSep: '.', aDec: ','} );">
                        <f:convertNumber type="currency" locale="pt,BR"/>
                    </p:inputText>

                    <div class="clear"/>

                    <p:outputLabel value="Valor do Repasse:" styleClass="grid_4" style="margin-left: -27px;" for="repasseInputText"/>
                    <p:inputText styleClass="grid_20" id="repasseInputText" value="#{managerCriarProjeto.projeto.repasse}"
                                 onkeypress="jQuery(this).autoNumeric({aSign:'R$ ', aSep: '.', aDec: ','} );">
                        <f:convertNumber type="currency" locale="pt,BR"/>
                    </p:inputText>

                    <div class="clear"/>

                    <h2>Anexo</h2>



                    <p:outputLabel value="Anexo:" styleClass="grid_3" />
                    <div class="grid_20">
                        <p:fileUpload 
                            mode="advanced"
                            label="Anexar"
                            uploadLabel="Enviar"
                            cancelLabel="Cancelar"
                            fileUploadListener="#{managerCriarProjeto.handleAnnex}"
                            multiple="true"
                            auto="true"
                            allowTypes="/(\.|\/)(gif|jpe?g|png)$/"
                            dragDropSupport="true"
                            invalidFileMessage="Tipo de arquivo não suportado."
                            invalidSizeMessage="Tamanho do arquivo não é suportado"
                            immediate="true"
                            update=":projetoForm:anexosPanel" />
                    </div>

                    <p:panel id="anexosPanel" >

                        <p:outputLabel value="Arquivos anexados:" styleClass="grid_5" style="margin-left: -70px;" />
                        <h:outputText value="Não há anexos!" rendered="#{empty managerCriarProjeto.projeto.anexos}" 
                                      styleClass="grid_4" />

                        <div class="grid_20">
                            <ui:repeat value="#{managerCriarProjeto.projeto.anexos}" var="a">
                                <p:panel styleClass="grid_5">
                                    <h:outputLink  
                                        value="#{a.tipo ne 'application/pdf' ? 'viewImage.xhtml':'show'}" title="#{a.tipo}"  target="_blank" >

                                        <div style="width: 100%;" class="grid_4">

                                            <p:graphicImage id="anexoImagem"
                                                            styleClass="image grid_3" rendered="#{a.tipo ne 'application/pdf'}"
                                                            style="margin-left:3%; width: 80px;"
                                                            url="show/?annex=#{a.url.concat('thumbnail.').concat(a.nome)}" />

                                            <p:graphicImage id="anexoPdf"
                                                            styleClass="image grid_3" rendered="#{a.tipo eq 'application/pdf'}"
                                                            style="margin-left:3%; width: 80px;" 
                                                            url="media/images/pdf.jpeg" />

                                            <div class="clear"/>
                                            <p:outputLabel  value="#{a.nome}" 
                                                            for="anexoImagem"
                                                            style="margin-left:1%; width: 100px;" rendered="#{a.tipo ne 'application/pdf'}"/>

                                            <p:outputLabel for="anexoPdf"
                                                           value="#{a.nome}" 
                                                           style="margin-left:1%; width: 100px;" rendered="#{a.tipo eq 'application/pdf'}"/>
                                        </div>
                                        <f:param name="annex" value="#{a.url.concat(a.nome)}"/>
                                    </h:outputLink>

                                    <p:commandButton id="removeButton" alt="Remover" value="Remover"
                                                     icon="ui-icon-trash" update=":projetoForm:anexosPanel"
                                                     actionListener="#{managerCriarProjeto.removerAnexo(a)}" />
                                </p:panel>
                            </ui:repeat>
                        </div>
                    </p:panel>

                    <div class="clear"/>
                    <div class="buttonAction">
                        <p:commandButton value="Salvar" actionListener="#{managerCriarProjeto.salvar()}"
                                         icon="ui-icon-disk" styleClass="ui-priority-primary"
                                         update="@form"  />
                        <p:button value="Cancelar" icon="ui-icon-circle-close"
                                  href="index.xhtml"/>
                    </div>

                </p:panel>
            </h:form>
            <h:form id="secretariaDialogForm">

                <p:dialog id="secretariaDialog" header="Campus" widgetVar="dlg" modal="false"
                          width="750" resizable="false" height="400">  

                    <p:panel id="secretariaPanel" styleClass="container_24 clearfix">
                        <p:outputLabel value="Nome:" styleClass="grid_3"/>
                        <p:inputText  styleClass="grid_10" value="#{managerCriarProjeto.secretariaPesquisar.nome}"/>

                        <p:outputLabel value="Sigla:" styleClass="grid_3"/>
                        <p:inputText  styleClass="grid_6" style="width: 20%;" value="#{managerCriarProjeto.secretariaPesquisar.sgl}"/>
                        <div class="clear" />

                        <p:outputLabel value="Diretor:" styleClass="grid_3"/>
                        <p:inputText  styleClass="grid_19" value="#{managerCriarProjeto.secretariaPesquisar.nomeSecretario}"/>
                    </p:panel>

                    <div class="buttonAction">
                        <p:commandButton value="Pesquisar" actionListener="#{managerCriarProjeto.pesquisarSecretaria()}"  
                                         icon="ui-icon-search" styleClass="ui-priority-primary"
                                         process="@all" update="secretariaTable"/>

                    </div>

                    <p:panel id="dlgPanel" styleClass="container_24 clearfix">
                        <p:dataTable id="secretariaTable" var="item" value="#{managerCriarProjeto.secretarias}" 
                                     styleClass="grid_24" rowIndexVar="rowid" 
                                     style="white-space: pre-wrap;"
                                     rowKey="#{item.id}" rows="5" paginator="true"  
                                     paginatorPosition="bottom" emptyMessage="Nenhum registro">  
                            <f:facet name="header">
                                <p:outputLabel value="Campus" />
                            </f:facet>
                            <p:column headerText="Ação" width="10px;" > 
                                <p:commandButton icon="ui-icon-check"
                                                 actionListener="#{managerCriarProjeto.setarSecretaria(item)}"
                                                 update=":projetoForm:secInput, 
                                                 :projetoForm:removerSecretariaCommandButton, :projetoForm:buttonsPanel, @form"/>
                            </p:column>
                            <p:column headerText="Nome"> 
                                <p:outputLabel value="#{item.nome}"/>
                            </p:column>
                            <p:column headerText="Diretor">
                                <p:outputLabel value="#{item.nomeSecretario}"/>
                            </p:column>
                            <p:column headerText="Sigla">
                                <p:outputLabel value="#{item.sgl}"/>
                            </p:column>

                        </p:dataTable>
                    </p:panel>
                    <div class="buttonAction">
                        <p:commandButton value="Sair" process="@this" onclick="dlg.hide()" icon="ui-icon-close" />
                    </div>
                </p:dialog>  


                <p:dialog id="responsavelDialog" header="Usuário Responsável" widgetVar="dlgresp" modal="false"
                          width="750" resizable="false" height="400">  

                    <p:panel id="responsavelPanel" styleClass="container_24 clearfix">
                        <p:outputLabel value="Nome:" styleClass="grid_3"/>
                        <p:inputText  styleClass="grid_20" value="#{managerCriarProjeto.responsavelPesquisar.nome}"/>

                    </p:panel>

                    <div class="buttonAction">
                        <p:commandButton value="Pesquisar" actionListener="#{managerCriarProjeto.pesquisarResponsavel()}"  
                                         icon="ui-icon-search" styleClass="ui-priority-primary"
                                         process="@all" update="responsavelTable"/>

                    </div>

                    <p:panel id="dlgresponsavelPanel" styleClass="container_24 clearfix">
                        <p:dataTable id="responsavelTable" var="item" value="#{managerCriarProjeto.usuarios}" 
                                     styleClass="grid_24" rowIndexVar="rowid" 
                                     style="white-space: pre-wrap;"
                                     rowKey="#{item.id}" rows="5" paginator="true"  
                                     paginatorPosition="bottom" emptyMessage="Nenhum registro">  
                            <f:facet name="header">
                                <p:outputLabel value="Usuários" />
                            </f:facet>
                            <p:column headerText="Ação" width="10px;" > 
                                <p:commandButton icon="ui-icon-check"
                                                 actionListener="#{managerCriarProjeto.setarResponsavel(item)}"
                                                 update=":projetoForm:respInputText, 
                                                 :projetoForm:removerResponsavelCommandButton, :projetoForm:buttonsRespPanel, @form"/>
                            </p:column>
                            <p:column headerText="Nome"> 
                                <p:outputLabel value="#{item.nome}"/>
                            </p:column>
                            <p:column headerText="Secretaria">
                                <p:outputLabel value="#{item.setor.secretaria.nome}"/>
                            </p:column>

                        </p:dataTable>
                    </p:panel>
                    <div class="buttonAction">
                        <p:commandButton value="Sair" process="@this" onclick="dlgresp.hide()" icon="ui-icon-close" />
                    </div>
                </p:dialog>



                <p:dialog id="empresaDialog" header="Empresa" widgetVar="dlgempresa" modal="false"
                          width="750" resizable="false" height="400">  

                    <p:panel id="empresaPanel" styleClass="container_24 clearfix">
                        <p:outputLabel value="Nome:" styleClass="grid_3"/>
                        <p:inputText  styleClass="grid_20" value="#{managerCriarProjeto.empresaPesquisar.nomeFantasia}"/>

                    </p:panel>

                    <div class="buttonAction">
                        <p:commandButton value="Pesquisar" actionListener="#{managerCriarProjeto.pesquisarEmpresa()}"  
                                         icon="ui-icon-search" styleClass="ui-priority-primary"
                                         process="@all" update="empresaTable"/>
                    </div>

                    <p:panel id="dlgempresaPanel" styleClass="container_24 clearfix">
                        <p:dataTable id="empresaTable" var="item" value="#{managerCriarProjeto.empresas}" 
                                     styleClass="grid_24" rowIndexVar="rowid" 
                                     style="white-space: pre-wrap;"
                                     rowKey="#{item.id}" rows="5" paginator="true"  
                                     paginatorPosition="bottom" emptyMessage="Nenhum registro">  
                            <f:facet name="header">
                                <p:outputLabel value="Usuários" />
                            </f:facet>
                            <p:column headerText="Ação" width="10px;" > 
                                <p:commandButton icon="ui-icon-check"
                                                 actionListener="#{managerCriarProjeto.setarEmpresa(item)}"
                                                 update=":projetoForm:empresaPanel, :projetoForm:addressPanel, @form"/>
                            </p:column>
                            <p:column headerText="Nome"> 
                                <p:outputLabel value="#{item.nomeFantasia}"/>
                            </p:column>
                            <p:column headerText="CNPJ">
                                <p:outputLabel value="#{item.cnpj}"/>
                            </p:column>

                        </p:dataTable>
                    </p:panel>
                    <div class="buttonAction">
                        <p:commandButton value="Sair" process="@this" onclick="dlgresp.hide()" icon="ui-icon-close" />
                    </div>
                </p:dialog>

            </h:form>
            <script  type="text/javascript" src="media/js/autoNumeric.js"></script>
        </ui:define>
    </ui:composition>
</html>